<template>
	<view>
		<!-- 轮播图 -->
		<uni-swiper-dot class="uni-swiper-dot-box" :info="data" :current="current" field="content">
			<swiper class="swiper-box" :current="swiperDotIndex" @change="changeSwiper">
				<swiper-item v-for="(item, index) in data" :key="index">
					<view class="swiper-item" @click="clickBannerItem(item)">
						<image :src="item.image" mode="aspectFill" :draggable="false" />
					</view>
				</swiper-item>
			</swiper>
		</uni-swiper-dot>

		<view v-if="files.length==0">
			<view class="cu-form-group margin">
				<input type="number" maxlength="6" placeholder="请输入6位取件码" name="input" @input="codeInput"></input>

			</view>
			<view class="padding flex flex-direction">
				<button class="cu-btn bg-blue lg" @click="accept">接受文件</button>
			</view>
		</view>
		<view v-if="files.length>0">
			<view class="cu-list menu-avatar margin-top">
				<view class="cu-item"  v-for="(item,index) in files"
					:key="index"
					:data-target="'move-box-' + index">
					<view class="cu-avatar  lg"></view>
					<view class="content" @click="download(item)">
						<view class="text-grey text-ellipsis ">{{item.oss.originalName}}</view>
						<view class="text-gray text-sm">
							{{item.oss.createTime}}
						</view>
					</view>
					<view class="action" @click="download(item.oss.url)">
						<view class="cuIcon-down round"></view>
					</view>
				</view>
			</view>
			<view class="padding-xs flex align-center">
				<view class="flex-sub text-center">
					<view class="solid-bottom text-xs padding">
						<text class="">{{remark}}</text>
					</view>
				</view>
			</view>
<!-- 			<view class="cu-list menu card-menu margin-top-xl margin-bottom-xl shadow-lg">
				<view class="cu-item" v-for="(item,index) in files" :key="index">
					<view class="content" @click="download(item.oss.url)">
						<text class="cuIcon-down text-grey"></text>
						<text class="text-grey">{{item.oss.originalName}}</text>
					</view>
				</view>
			</view> -->
			<view class="padding flex flex-direction">
				<button class="cu-btn bg-blue lg" @click="files=[]">继续接收</button>
			</view>
		</view>
		<view class="cu-tabbar-height"></view>
	</view>
</template>

<script>
import { getListByCode } from "@/api/system/file";
export default {
  data() {
    return {
      code: "",
      files: [],
      remark: "",
      openId: "",
      current: 0,
      swiperDotIndex: 0,
      data: [
        {
          image: "/static/banner.jpg",
        },
        {
          image: "/static/banner.jpg",
        },
        {
          image: "/static/banner.jpg",
        },
      ],
    };
  },
  onShow() {
  },
  methods: {
    getOpenId() {
      let that = this;
      wx.login({
        success: function (res) {
          if (res.code) {
            that.getSession(res.code);
          } else {
            console.log("登录失败！" + res.errMsg);
          }
        },
      });
    },
    getSession(code) {
      let that = this;
      console.log(this.server + "/open/getSessionByCode");
      uni.request({
        url: this.server + "/open/getSessionByCode",
        data: {
          code: code,
        },
        method: "GET",
        success(res) {
          that.openid = res.data.data.openid;
          that.getUserId(that.openid);
        },
      });
    },
    getUserId(openid) {
      console.log(openid);
      uni.request({
        url: this.server + "/open/getUserInfoByOpenid",
        data: {
          openid: openid,
        },
        method: "GET",
        success(res) {
          uni.setStorageSync("userId", res.data.data.id);
        },
      });
    },
    download(path) {
      uni.downloadFile({
        url: path, //仅为示例，并非真实的资源
        success: (res) => {
          let url = res.tempFilePath;
          uni.saveFile({
            tempFilePath: url,
            success: (res) => {
              uni.showToast({
                title: "下载成功",
              });
            },
          });
        },
      });
    },
    getFileName(path) {
      var arr = path.split("/");
      let fileName = arr[arr.length - 1];
      if (fileName.length > 15) {
        arr = fileName.split(".");
        fileName = fileName.substring(0, 15) + "..." + arr[arr.length - 1];
      }
      return fileName;
    },
    codeInput(e) {
      this.code = e.detail.value;
    },

    accept() {
      getListByCode(this.code, $store.getters.userid).then((res) => {
        this.files = res.data;
        this.remark = res.msg;
      });
    },
  },
};
</script>

<style lang="scss">
/* #ifndef APP-NVUE */
page {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  background-color: #fff;
  min-height: 100%;
  height: auto;
}

view {
  font-size: 14px;
  line-height: inherit;
}

/* #endif */

.text {
  text-align: center;
  font-size: 26rpx;
  margin-top: 10rpx;
}

.grid-item-box {
  flex: 1;
  /* #ifndef APP-NVUE */
  display: flex;
  /* #endif */
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 15px 0;
}

.uni-margin-wrap {
  width: 690rpx;
  width: 100%;
}

.swiper {
  height: 300rpx;
}

.swiper-box {
  height: 150px;
}

.swiper-item {
  /* #ifndef APP-NVUE */
  display: flex;
  /* #endif */
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #fff;
  height: 300rpx;
  line-height: 300rpx;
}

@media screen and (min-width: 500px) {
  .uni-swiper-dot-box {
    width: 400px;
    /* #ifndef APP-NVUE */
    margin: 0 auto;
    /* #endif */
    margin-top: 8px;
  }

  .image {
    width: 100%;
  }
}
.text-ellipsis {
  width: 90%;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cu-avatar {
  background-image: url("/static/images/24gl-fileText.png");
  background-color: initial;
}
</style>